<!--
 hyperscript 的简称——意思是“能生成 HTML (超文本标记语言) 的 JavaScript
@description: H函数学习
@author: hj
@time: 2022-09-06 22:19:53
-->
<template />

<script lang="ts">
import { ref, h } from 'vue'
export default {
  props: {
    msg: {
      type: String,
      default: 'Hello h',
    },
  },
  setup(props: { msg: string }) {
    const count = ref(1)

    // 返回渲染函数（setup会自动暴露数据给模板）
    // return () =>
    //   h(
    //     'div',
    //     { id: 'hj', class: 'hc', onClick: () => console.log('哈哈哈') },
    //     h('div', [props.msg + count.value, h('h1', '我是子')]),
    //   )
    const simpleH = h('div', props.msg)
    return () =>
      h(
        'div',
        Array.from({ length: 20 }).map(() => simpleH),
      )
  },
}
</script>

<style scoped lang="scss"></style>
